<html>
<head>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta http-equiv="Cache-Control" content="no-store"/>
<meta http-equiv="Pragma" content="no-cache"/>
<meta http-equiv="Expires" content="0"/>
<link rel="stylesheet" type="text/css" href="../styles/html.css" />
<link rel="stylesheet" type="text/css" href="../styles/default.css" />
<script type="text/javascript" src="../scripts/jquery/lib/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="../scripts/jquery/lib/jquery.bgiframe.min.js"></script>
<script type="text/javascript">
<!--
	var context='../';
-->
</script>
  <link rel="stylesheet" type="text/css" href="../scripts/jquery/easyui/themes/default/easyui-custom.css" />
<link rel="stylesheet" type="text/css" href="../scripts/jquery/easyui/themes/icon.css" />
<script type="text/javascript" src="../scripts/jquery/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../scripts/jquery/easyui/locale/easyui-lang-zh_CN.js"></script>


  
  <script type="text/javascript" src="../scripts/utils/ajaxupload.js"></script>
  <script type="text/javascript" src="../scripts/appjs/common.js"></script> 
  <link href="../scripts/jquery/showLoading/css/showLoading.css" rel="stylesheet" media="screen" />
  <script type="text/javascript" src="../scripts/jquery/showLoading/js/jquery.showLoading.js"></script>
  <script type="text/javascript">
  <!--
  		$(document).ready(function(){
  			$.acflow.tableGrid('#tableList',{title:'Reserve Space'});  		
  			
  		});
  		
  		function submitForm(taskId){
  			var action = "../leave/claim-task.do";
  			var src = "../leave/unsigned-task-list.do";
  			
  			var row = $('#tableList').datagrid('getSelected');
			if (row){
				$.messager.confirm('Please confirm','Will you reserve the space '+ row.id +' ?',function(r){
					if (r){
						
			  			$.messager.alert('Info','Reserved.'); 
						row.status = "Booked";
						
					}
				});
			}
  			
  			
  		}
  		
	-->
	  </script>
	  </head>
<body>
	
  	<div id="showLoading" style="margin: 10px">
	  	<div><img src="../images/info_16.png" />Current Page：User Menu &gt; Reserve Space</div>
	  	<div style="width: 100%;height: 400px;padding-top: 6px">
	    <table id="tableList">
	    	<thead>
	    		<tr>
	    			<th field="count" width="60" align="center">No.</th>
	    			<th field="id" width="40" align="center">ID</th>
	    			<th field="status" width="80" align="center">Status</th>
	    			<th field="location" width="80" align="center">Location</th>
	    			<th field="carType" width="80" align="center">Car Type</th>
	    			<th field="description" width="350" align="center">Descrition</th>
	    			<th field="opAction" width="150" align="center">Action</th>
	    		</tr>
	    	</thead>
	    	<tbody>
	    		
	    		<tr>
	    			<td>1</td>
	    			<td>101</td>
	    			<td>Booked</td>
	    			<td>East Section</td>
	    			<td>Truck</td>
	    			<td>suitable for truck</td>
	    			<td>Reserve this                    
                    </td>
	    		</tr>
	    		<tr>
	    			<td>2</td>
	    			<td>102</td>
	    			<td>Avalaible</td>
	    			<td>West Section</td>
	    			<td>Car</td>
	    			<td>suitable for car</td>
	    			<td><a href="javascript:submitForm(102);" >Reserve this</a>                    </td>
	    		</tr>
	    		<tr>
	    			<td>3</td>
	    			<td>106</td>
	    			<td>Avalaible</td>
	    			<td>North Section</td>
	    			<td>Car</td>
	    			<td>suitable for car</td>
	    			<td><a href="javascript:submitForm(106);" >Reserve this</a>                    </td>
	    		</tr>
	    	</tbody>
	    </table>
	    <div style="text-align: center;padding-top: 12px">
	    	
	    </div>
	    </div>
	    
	    <form id="showUrlForm" action="" method="get"></form>
    </div>

</body>
</html>